import {Component, HostListener} from '@angular/core';
import {ActivatedRoute, NavigationEnd, Router} from "@angular/router";
import {CateService} from "../providers/service/cate.service";
import {Location} from "@angular/common";

@Component({
    selector: 'app-cate',
    templateUrl: './cate.component.html'
})


export class CateComponent {

    cateId: number;//分类id
    cateChild: any;//子类
    articles: any;//分类下的文章
    page: any;//分页数组
    list: any;//列表数据
    flag: boolean;

    constructor(
        private cateService: CateService,
        private activatedRoute: ActivatedRoute,
        private location: Location,
        private router: Router,
    ) {
        this.initData();
        this.list = [];
        this.flag = false;
    }

    ngOnInit() {
        this.router.events
            .subscribe((event) => {
                if (event instanceof NavigationEnd) { // 当导航成功结束时执行
                    this.initData();
                }
            });
    }

    //分类
    pageData() {
        this.cateService.cate({cateId: this.cateId})
            .subscribe(data => {
                if (data.status_code == 200) {
                    this.cateChild = data.result.cateChild;
                    console.log(this.cateChild);
                }
            });
    }

    //文章列表
    articleByCate() {
        this.cateService.getArticleByCate({cateId: this.cateId, page: this.articles.current_page})
            .subscribe(data => {
                if (data.status_code == 200) {
                    this.articles = data.result;

                    //将数据追加到尾部
                    for (let v of data.result.data) {
                        this.list.push(v);
                    }

                    if (this.page.length < 1) {
                        for (let i = 1; i <= this.articles.last_page; i++) {
                            this.page.push(i);
                        }
                    }
                }

            })

    }

    //翻页
    changePage(flag: any) {
        const currentPage = parseInt(this.articles.current_page);
        const lastPage = parseInt(this.articles.last_page);
        if (flag == '-' && currentPage > 1) {
            this.articles.current_page--;
            this.articleByCate();
        }
        if (flag == '+' && currentPage < lastPage) {
            this.articles.current_page++;
            this.articleByCate();
        }
        if (flag != '+' && flag != '-') {
            this.articles.current_page = flag;
            this.articleByCate();
        }

    }


    //监听滚动，加载数据
    @HostListener('window:scroll', ['$event']) public onScroll = ($event) => {

        //客户端高度
        var clientH = document.documentElement.clientHeight;
        //body高度
        var bodyH = document.body.clientHeight;

        //滚动的高度
        var scrollTop = document.documentElement.scrollTop;

        //滚动到底部60以内
        if (bodyH - clientH - scrollTop < 60) {
            if (!this.flag) {
                console.log('翻页');
                //翻页
                this.changePage('+');
            }
            this.flag = true;
        } else {
            this.flag = false;
        }
    }

    initData() {
        this.cateId = this.activatedRoute.snapshot.params['id'] || 0;
        if (!this.cateId) {
            this.location.back();
        }
        this.cateChild = [];
        this.articles = [];

        this.articles = {
            current_page: 1,
            data: [],
            last_page: 0//最后一页
        };
        this.page = [];
        this.pageData();
        this.articleByCate();
    }

}
